<template>
  <Popup v-model:show="showBottom" position="bottom">
    <div class="reset_popup">
      <div class="popup_title">
        <img
          alt=""
          src="../../assets/images/sig_logo.png"
        />深i工深圳工会职工服务平台
      </div>
      <h4 class="strong">申请获取你的个人信息</h4>
      <p>
        {{ prop.desc || "将获取你的姓名、手机号、身份证、工会信息、用于报名" }}
      </p>
      <div class="flex_around">
        <Button class="w14" type="default" @click="reject()">拒绝</Button>
        <Button class="w14" type="success" @click="() => emits('allow')"
        >允许
        </Button
        >
      </div>
    </div>
  </Popup>
</template>
<script setup>
import { Button, Popup } from "vant";
import { computed, } from "vue";

// defineOptions({ name: "AuthPopup" });

const prop = defineProps(["modelValue", "desc"]);
const emits = defineEmits(["update:modelValue", "allow", "reject"]);
const showBottom = computed({
  get: () => prop.modelValue,
  set: (val) => emits("update:modelValue", val),
});
// 拒绝
const reject = () => {
  showBottom.value = false;
  emits("reject");
};
</script>
<style scoped>
.reset_popup {
  background: #f4f4f4;
  padding: 2rem;
}

.strong {
  font-weight: 600;
}

.flex_around {
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin-top: 2rem;
}

.popup_title {
  margin-bottom: 1.5rem;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
}

.popup_title img {
  width: 2rem;
  padding-right: 0.4rem;
}
</style>
